import React, { useState } from 'react'
import { Button, Modal } from 'antd'
import { useSnapshot } from 'valtio'
import { UserFz } from '@/stores/UserFz'
import { useNavigate } from 'react-router-dom'

const App: React.FC = () => {
    const [isModalOpen, setIsModalOpen] = useState(false)
    const nav = useNavigate()

    const showModal = () => {
        setIsModalOpen(true)
    }

    const handleOk = () => {
        nav('/login')
        setIsModalOpen(false)
    }

    const handleCancel = () => {
        setIsModalOpen(false)
    }
    const userStore = useSnapshot(UserFz)

    return (
        <>
            <div onClick={showModal}>{userStore.user?.username}</div>
            <Modal
                title="Basic Modal"
                open={isModalOpen}
                onOk={handleOk}
                onCancel={handleCancel}
            >
                确认退出吗？
            </Modal>
        </>
    )
}

export default App
